<template>
	<el-dialog class="abow-dialog" :visible.sync="visible" title="获取推广链接" :close-on-click-modal="false"
		:close-on-press-escape="false" width="650px">
		<el-card class="box-card mb-10" shadow="never">
			<div class="mb-20">
				<div class="text item mb-5">小程序链接：</div>
				<el-link class="mb-5" type="primary">{{dataForm.wx_link}}</el-link>
				<el-button type="primary" size="small" icon="el-icon-copy-document"
					@click="copyText(dataForm.wx_link)">复制</el-button>
			</div>
			<div class="">
				<div class="text item mb-5">小程序路由：</div>
				<el-link class="mb-5" type="primary">{{dataForm.wx_route}}</el-link>
				<el-button type="primary" size="small" icon="el-icon-copy-document"
					@click="copyText(dataForm.wx_route)">复制</el-button>
			</div>
		</el-card>
	</el-dialog>
</template>

<script>
	let that;
	import * as clipboard from 'clipboard-polyfill'
	import {
		debounce
	} from 'lodash'
	import {
		isEmail,
		isMobile
	} from '@/libs/validate'
	import schema from 'async-validator'
	export default {
		data() {
			return {
				dataId: null,
				visible: false,
				dataForm: {
					wx_link: '',
					wx_route: ''
				}
			}
		},
		created() {
			that = this;
		},
		computed: {},
		watch: {},
		methods: {
			copyText(text) {
				console.log(text);
				clipboard.writeText(text).then(
					function() {
						that.$message({
							message: '复制成功！',
							type: 'success',
							duration: 1500
						})
					},
					function() {
						that.$message({
							message: '复制失败！',
							type: 'error',
							duration: 1500
						})
					}
				);
			},
			init() {
				this.visible = true;
				this.$nextTick(() => {
					setTimeout(() => {
						this.$refs.dataForm.resetFields();
					}, 200)
				})
			},
			update(row) {
				this.visible = true;
				this.$nextTick(() => {
					let rowData = Object.assign({}, row);
					this.dataForm.wx_link = rowData.wx_link || '';
					this.dataForm.wx_route = rowData.wx_route || '';
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.form {
		width: 580px;
	}
</style>